<template>
	<view>
		<u-steps class="setps-box" :list="numList" :current="numIndex" mode="number" @click="chang_num_index"></u-steps>

		<u-cell-group :title=" vehicle_select_title ">
			<u-cell-item :title="item.name" value="" :arrow="item.next" :key="index" v-for="(item,index) in vehicle_select" @click="choose(item,index)">
			</u-cell-item>
		</u-cell-group>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				numList: [{
					name: '重选',
					activeColor: '#ff9900',
					icon:'reload'
				}, {
					name: '品牌',
					activeColor: '#009900'
				}, {
					name: '车型',
					activeColor: '#009900'
				}, {
					name: '排量'
				}, {
					name: '年份'
				}, {
					name: '款式'
				}, ],
				numIndex: 2,
				vehicle: [],
				vehicle_select_title: '请选择排量',
				vehicle_select_names: [],
				vehicle_select: [],
				params:[]
			}
		},
		onLoad(option) {
			//params={"computed":false,"brand_name":"宝马","brand_id":"2342a7004930ede0736ebfa9c45190b2","vehicle_id":"VE-LBV-118i","vehicle_name":"118i"}&__id__=1
			let _self = this
			if (option.hasOwnProperty('params')) {
				_self.params = JSON.parse(option.params)
			}
		},
		created() {
			let _self = this
			_self.vehicle = uni.getStorageSync('vehice_storage')
		},
		onUnload() {
			let _self = this
			uni.$off('vechiceComputed')
		},
		mounted() {
			let _self = this
			_self.vehicle = _self.is_next(_self.vehicle)
			_self.vehicle_select = _self.vehicle
		},
		watch:{	
			vehicle_select_names(nV,ov){	
				let _self = this
				let default_text=[
					'请选择排量',
					'请选择年份',
					'请选择款式',
				]
				let len = _self.vehicle_select_names.length;
				if (len == 3) {
					return
				} 
				let arr = _self.vehicle_select_names.concat(default_text[len])
				_self.vehicle_select_title = arr.join('-')
			}
		},
		methods: {
			is_next(s) {
				var _arr = JSON.parse(JSON.stringify(s))
				var _tmp = []
				Object.keys(_arr).map((value, index, array) => {
					_tmp.push({
						'name': value,
						'data': [],
						'next': true
					});
					Object.keys(_arr[value]).map((v1, i1, a1) => {
						_tmp[index].data.push({
							'name': v1,
							'data': [],
							'next': true
						})
						_arr[value][v1].map((v2, i2, a2) => {
							_tmp[index]['data'][i1].data.push({
								'name': v2,
								'data': [],
								'next': false
							})
						})
					})
				});
				return _tmp
			},
			choose(data, index) {
				let _self=this
				_self.numIndex++
				if(_self.vehicle_select_names.length < 3){			
					_self.vehicle_select_names.push(data.name);
				}
				if (false == data.next) {
					_self.params.vehicle_data = _self.vehicle_select_names;
					let _params = JSON.stringify(_self.params);
					return uni.redirectTo({
						url: '/pages/selector/index?params='+_params
					});
				}
				_self.vehicle_select = data.data
			},
			chang_num_index(e){
				let _self=this
				if(0 == e){
					_self.numIndex = 2
					_self.vehicle_select = _self.vehicle
					_self.vehicle_select_names = [] 
				}
			}
		}
	}
</script>

<style>
.u-steps{
	margin-top:30rpx;
}
</style>
